<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
        <meta name="description" content="生成带有二维码的图文页面">
        <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
        <meta http-equiv="Access-Control-Allow-Origin" content="*">
        <link rel="stylesheet" href="/apps/css/weui.min-2.6.4.css">
        <title>{{title}}</title>
        <script src="/apps/js/baidu-tongji-mtx.js"></script>
        <style>
            body{
                background-image: url('https://totemlife.cn/apps/public/background-ededed.png');
                background-repeat: no-repeat; background-size: 100% 100%; overflow-x: hidden;
                background-position: center center; background-size: cover; -o-background-size: cover;
                -webkit-background-size: cover; -moz-background-size: cover;
                padding-bottom: 100px; min-height: 100vh; display: flex; flex-direction: column;
            };
            .page{ min-height: 100vh; }
            .weui-msg{ min-height: 100vh; background-color:rgb(255,255,255,0); }
        </style>
    </head>
    <body ontouchstart style="background-image: url('https://totemlife.cn/apps/default-image');">
        <div class="weui-msg">
            <div class="weui-msg__text-area">
                <div class="weui-media-box" style="background:rgba(0,0,0,0.68)">
                    <h2 style="color:#88b04b;text-align:center;"><strong>{{{message}}}</strong></h2>
                    <h3 style="color:#ffffff;">{{{description}}}</h3>
                </div>
            </div>
            <div class="weui-msg__extra_area">
                <div id="footer" class="weui_footer">
                    <div style="height: 100%; width: 100%; display: flex; background-color: rgba(0,0,0,0.5);">
                        <div style="width: 75%; padding: 18px; overflow: hidden; text-overflow: ellipsis; text-align:left">
                            <span style="color: #ffffff; margin:0;"><small>{{comment}}</small></span>
                        </div>
                        <div style="width: 25%; display: flex; flex-direction: column; justify-content: center; align-items: center;">
                            <img src="{{qrImg}}" alt="QR Code" style="padding:10px; width:100%; display: block;">
                            <small style="text-align: center; color: #ffffff; margin: 0 0;">{{refNo}}</small>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
        <script src="/apps/js/wx-client-dom.js"></script>
    </body>
</html>
